<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="root" value="${pageContext.request.contextPath}"/>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jstl/fmt_rt" %>
<html>
<head>
    <title>猫眼电影 - 一网打尽好电影</title>

    <meta charset="utf-8">
    <meta name="keywords" content="">
    <meta name="description" content="">
    <meta http-equiv="cleartype" content="yes" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="renderer" content="webkit" />

    <meta name="HandheldFriendly" content="true" />
    <meta name="format-detection" content="email=no" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="viewport" content="width=device-width, initial-scale=1">


    <script>"use strict";!function(){var i=0<arguments.length&&void 0!==arguments[0]?arguments[0]:"_Owl_",n=window;n[i]||(n[i]={isRunning:!1,isReady:!1,preTasks:[],dataSet:[],use:function(i,t){this.isReady&&n.Owl&&n.Owl[i](t),this.preTasks.push({api:i,data:[t]})},add:function(i){this.dataSet.push(i)},run:function(){var t=this;if(!this.isRunning){this.isRunning=!0;var i=n.onerror;n.onerror=function(){this.isReady||this.add({type:"jsError",data:arguments}),i&&i.apply(n,arguments)}.bind(this),(n.addEventListener||n.attachEvent)("error",function(i){t.isReady||t.add({type:"resError",data:[i]})},!0)}}},n[i].run())}();</script>
    <script>
        cid = "c_pffcmyp6";
        ci = 112;
        window.system = {"user":{"id":339665704,"token":"q0h9fiqLD98ncB1swQAaYlYn-V4AAAAAkQgAAKcoUiZ4l5JoaajwI-JfWjnO4swJVGTYnL8hiWwGo2HmYF214sBI1nQ5rrE8ab1LtA","username":"炸毛之王","profile":{"age":"20","authInfo":"","avatarType":255,"avatarurl":"https://img.meituan.net/avatar/dbd8da2276e9d2693668f27e42e4ae6d67763.jpg","birthday":926956800000,"currentExp":285,"gender":2,"id":339665704,"interest":"摄影,动漫,游戏","juryLevel":0,"maoyanAge":"3","marriage":"热恋中","nextTitle":"","nickName":"炸毛之王","nickNameStatus":0,"occupation":"IT","registerTime":1460298617000,"roleType":0,"signature":"","signatureStatus":0,"ticketCount":13,"title":"白银会员","tmpNickName":"","tmpSignature":"","topicCount":0,"totalExp":500,"uid":1282244662,"userLevel":2,"userNextLevel":3,"username":"炸毛之王","vipInfo":"","vipType":0,"visitorCount":2}},"uid":339665704};

        window.openPlatform = '';
        window.openPlatformSub = '';
        window.$mtsiFlag = '0';

    </script>
    <link rel="stylesheet" href="${root}/css/common.css"/>
    <link rel="stylesheet" href="${root}/css/profile-profile.css"/>
    <script crossorigin="anonymous" src="${root}/js/stat.js"></script>
    <script>if(window.devicePixelRatio >= 2) { document.write('<link rel="stylesheet" href="${root}/css/seats/image-2x.css"/>') }</script>
    <style>
        @font-face {
            font-family: stonefont;
            src: url('//vfile.meituan.net/colorstone/abbcc73ea32275bbd88942a6c0b83b913168.eot');
            src: url('//vfile.meituan.net/colorstone/abbcc73ea32275bbd88942a6c0b83b913168.eot?#iefix') format('embedded-opentype'),
            url('//vfile.meituan.net/colorstone/7457e845baf1355c8725e42f9034d20f2084.woff') format('woff');
        }

        .stonefont {
            font-family: stonefont;
        }
    </style>
</head>
<body>


<%@ include file="head.jsp" %>


<div class="container" id="app" class="page-profile/profile" >
    <div class="content">
        <div class="main">
            <div class="info-content clearfix">
                <div class="user-profile-nav">
                    <h1>个人中心</h1>
                    <a href="${root}/order/index" class="orders active">我的订单</a>
                </div>

                <div class="orders-container">
                    <div class="profile-title">我的订单</div>
                    <c:forEach var="o" items="${orderList}">
                        <div class="order-box" data-orderid="${o.id}">
                        <div class="order-header">
                            <span class="order-date"><fmt:formatDate value="${o.order_time}" pattern="yyyy-MM-dd"/></span>
                            <span class="order-id">猫眼订单号:${o.id}</span>
                            <span class="del-order" data-orderid="${o.id}"></span>
                        </div>

                        <div class="order-body">
                            <div class="poster">
                                <img src="${o.orderItem.movie.image}">
                            </div>

                            <div class="order-content">
                                <div class="movie-name">《${o.orderItem.movie.name}》</div>
                                <div class="cinema-name">至潮影城(学院路人才大厦店)</div>
                                <div class="hall-ticket">
                                    <span>贵宾5号厅（全部沙发躺着看）</span>
                                    <span>4排4座</span>
                                    <span>4排3座</span>
                                </div>
                                <div class="show-time">周四 5月16日 16:40</div>
                            </div>

                            <div class="order-price">￥${o.money}</div>

                            <div class="order-status">
                                已完成
                            </div>
                        </div>
                    </div>
                    </c:forEach>
                    <div class="orders-pager">
                        <ul class="list-pager">

                            <li class="active">
                                <a class="page_1"
                                   href="javascript:void(0);" style="cursor: default"
                                >1</a>
                            </li>
                            <li >
                                <a class="page_2"
                                   href="?offset=10"
                                >2</a>

                            </li>
                            <li>  <a class="page_2"
                                     href="?offset=10"
                            >下一页</a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="mask3">
        <div class="modal-container" style="display:none">
            <div class="modal">
                <span class="icon"></span>

                <p class="tip">您确定要删除该订单嘛？删除后，不可恢复～</p>

                <div class="short btn ok-btn">确定</div>
                <div class="short btn cancel-btn">取消</div>
            </div>
        </div>

    </div>

    <div class='mask1'>
        <div class="modal-container" style="display:none">
            <div class="modal">
                <span class="icon"></span>

                <p class="tip">请注意，注销账号会清空所有订单信息、影评、积分、<br>账户余额等信息且无法找回，是否继续？</p>

                <div class="short btn ok-btn">确定</div>
                <div class="short btn cancel-btn">取消</div>
            </div>
        </div>

    </div>

    <div class='mask2'>
        <div class="modal-container" style="display:none">
            <div class="modal">
                <span class="icon"></span>

                <p class="tip">请联系客服10105335</p>

                <div class="ok-btn btn">我知道了</div>
            </div>
        </div>

    </div>

</div>

<%@ include file="footer.jsp" %>
<script crossorigin="anonymous" src="${root}/js/profile-profile.js"></script>
</body>
</html>
